%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="CMCKendoUI.Web.WebForm1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script src="../js/jquery.tmpl.min.js" type="text/javascript"></script>
<script src="../js/kendo.all.js" type="text/javascript"></script>
<link href="../styles/kendo.common.css" rel="stylesheet" type="text/css" />
<link href="../styles/kendo.default.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">
var firstNames = ["Medical and Dental", "Students", "Nursing and Midwifery Registered", "Allied Health Professionals", "Additional Professional Scientific and Technical", "Healthcare Scientists", "Additional Clinical Services", "Administrative and Clerical", "Estates and Ancillary", "Supplementary Roles"],
lastNames = ["MAD", "STU", "NURS", "AHP", "TECH", "SCNTST", "CLIN", "CLERIC", "ESTATE", "SUPP"],
cities = ["Manual", "Manual", "Manual", "Manual", "Manual", "Manual", "Manual", "Manual", "Manual", "Manual"],
titles = ["Yes", "No", "No", "Yes", "Yes", "Yes", "No", "No", "Yes", "Yes"],
birthDates = ["Yes", "No", "No", "Yes", "Yes", "Yes", "No", "No", "Yes", "Yes"],
staffGroupTypes = ["Instructor Group", "", "", "Admission group", "Advisor Group", "Instructor Group", "", "", "Advisor Group", "Instructor Group"],
advisorCodes = ["Placeholder", "Placeholder", "Placeholder", "Placeholder", "Placeholder", "Placeholder", "Placeholder", "Placeholder", "Placeholder", "Placeholder"],
membershipEntities = ["Placeholder", "Placeholder", "Placeholder", "Placeholder", "Placeholder", "Placeholder", "Placeholder", "Placeholder", "Placeholder", "Placeholder"],
primaryDonors = ["No", "No", "No", "No", "No", "No", "No", "No", "No", "No"],
donorHirerchies = ["0", "0", "0", "0", "0", "0", "0", "0", "0", "0"],
Active = ["Yes", "Yes", "Yes", "Yes", "Yes", "Yes", "Yes", "Yes", "Yes", "Yes"];
function createRandomData(count) {
var data = [], now = new Date();
for (var i = 0; i < 9; i++) {
var firstName = firstNames[i],
lastName = lastNames[i],
city = cities[i],
title = titles[i],
birthDate = birthDates[i],
age = staffGroupTypes[i],
advisorCode = advisorCodes[i],
membershipEntitity = membershipEntities[i]
data.push({
Id: i + 1,
FirstName: firstName,
LastName: lastName,
City: city,
Title: title,
BirthDate: birthDate,
Age: age,
AdvisorCode: advisorCode,
MembershipEntity: membershipEntitity
});
}
return data;
}
$(document).ready(function ($) {
var ctlGrid = $("#KendoWebDataGrid3");
ctlGrid.kendoGrid({
dataSource: {
data: createRandomData(50),
schema: {
model: {
id: 'Id',
fields: {
select: {
type: "string"
},
Id: {
type: "number"
},
FirstName: {
editable: false
},
LastName: {
type: "string"
},
City: {
type: "string"
},
Title: {
type: "string"
},
BirthDate: {
type: "date"
},
Age: {
type: "number"
},
}
}
},
pageSize: 10
},
groupable: true,
editable: true,
selectable: true,
sortable: {
mode: 'single',
allowUnsort: false
},
pageable: true,
columns: [{
template: '#= kendo.toString("<input type=\'checkbox\' id=\'select\' />") #',
width: 32
}, {
template: '<a href="javascript:OpenCRUD(\'Abcd.aspx?Id=#=Id#\')">#=FirstName#</a>',
title: 'First Name',
width: 120
}, {
field: 'LastName',
title: 'Last Name',
width: 120
}, {
field: 'City'
}, {
field: 'Title',
width: 230
}, {
field: 'BirthDate',
title: 'Date Of Birth',
width: 120,
format: "{0:MM/dd/yyyy}",
template: '#= kendo.toString(BirthDate, "MM/dd/yyyy")#'
}, {
field: 'Age',
width: 80
}]
});
}); 
 
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="KendoWebDataGrid3" />
</form>
</body>
</html>
